<template>
	<div class="page has-navbar" v-nav="{hideNavbar: true}">
		<form @submit.prevent="nextStep">

			<von-header theme="assertive">
				<button class="button button-icon ion-ios-arrow-back" type="button" slot="left" @click="$router.go(-1)"></button>
				<span slot="title">更多信息</span>
				<button class="button button-icon" slot="right" type="submit">入库</button>
			</von-header>
			<div class="page-content padding-top">

				<list>
					<input type="hidden" name="marketId" v-model="marketId" required>
			        <input type="hidden" name="userId" v-model="userId" required>
			        <input type="hidden" name="carId" v-model="carId" required>
			       

					<item class="y-item item-icon-right" @click.native="showImage()">
						<span class="item-title">上传图片</span>
						<img src="static/images/ic_upload_img.svg" class="ic_upload_img" alt="">
						<input type="hidden" v-model="carImgList" name="carImageJson" >
						<i class="icon ion-ios-arrow-right" style="color: #DDD;"></i>
					</item>
					<item class="y-item item-icon-right" @click.native="showCarEnviron()">
						<span class="item-title">环保标准</span>
						<input type="text" class="y-item-input" name="carEnviron" v-model="res.carEnviron" placeholder="请选择环保标准" readonly required>
						<i class="icon ion-ios-arrow-right" style="color: #DDD;"></i>
					</item>
					<item class="y-item item-icon-right" @click.native="showCarConfig()">
						<span class="item-title">车辆配置</span>
						<input type="text" class="y-item-input" name="" v-model="configNameList" placeholder="请选择车辆配置" readonly required>
						<i class="icon ion-ios-arrow-right" style="color: #DDD;"></i>
						<input type="hidden" name="carConfIds" v-model="res.configList">

					</item>
					<item class="y-item item-icon-right" @click.native="showCarFuel()">
						<span class="item-title">燃料类型</span>
						<input type="text" class="y-item-input" name="carFuel" v-model="res.carFuel" placeholder="请选择燃料类型" readonly required>
						<i class="icon ion-ios-arrow-right" style="color: #DDD;"></i>
					</item>
					<item>
						<span class="item-title">是否4S店保养</span>
						<div style="float: right; margin: -15px 0;">
							<div class="item item-borderless item-toggle von-toggle">
								<label class="toggle toggle-balanced">
						            <input type="checkbox" v-model="pushNotification">
						            <div class="track">
						            	<div class="handle"></div>
						            </div>
						        </label>
							</div>
						</div>	
						<input type="hidden" v-model="res.car4sUpkeepState" name="car4sUpkeepState" />
						
					</item>
					

					<item class="y-item item-icon-right">
						<span class="item-title">瑕疵描述</span>
						<input type="text" class="y-item-input" name="carFlawDesc" v-model="res.carFlawDesc" placeholder="请输入车况">
					</item>
					<item class="y-item item-icon-right">
						<span class="item-title">卖点描述</span>
						<input type="text" class="y-item-input" name="carSellingPointDesc" v-model="res.carSellingPointDesc" placeholder="请输入卖点描述">
					</item>
					<item class="y-item item-icon-right">
						<span class="item-title">按揭说明</span>
						<input type="text" class="y-item-input" name="carMortgageDesc" v-model="res.carMortgageDesc" placeholder="请输入按揭说明">
					</item>

				</list>
			</div>
		</form>
		<reject v-if="carStockState == 1" :carId="carId" ></reject>  
	</div>
</template>
<script>
	import carImgModal from '../add/carImg.vue'
	import carEnvironModal from '../add/carEnviron.vue'
	import carConfigModal from '../add/carConfig.vue'
	import carFuelModal from '../add/carFuel.vue'
	import reject from 'src/assembly/reject.vue'

	import { bus } from 'bus.js'
	export default {
		data() {
			return {
				carImgModal: null,
				carEnvironModal: null,
				carConfigModal: null,
				carFuelModal: null,

				marketId: sess.get('userSession').marketId,
				shopId: sess.get('userSession').shopId,
				shop: sess.get('userSession').shopId || '',
				userId: sess.get('userSession').userId,
				carId: sess.get('carId'),
				pushNotification: false,

				carEnviron: '国V',
				carFuel: '汽油',
				carConfig: '',
				carFlawDesc: '',
				carMortgageDesc: '',
				carSellingPointDesc: '',
				configNameList: '',
				configList: '',
				carImgList: '',
				res:{
				},

			}
		},
		components: {
      reject
    },
		mounted() {
			$modal.fromComponent(carImgModal, {
				title: '添加图片',
				theme: 'assertive',
				onHide: () => {
					// console.log();
				},

			}).then((modal) => {

				this.carImgModal = modal;
			});

			$modal.fromComponent(carEnvironModal, {
				title: '环保标准',
				theme: 'assertive',
				onHide: () => {
					// console.log();
				}
			}).then((modal) => {
				this.carEnvironModal = modal;
			});

			$modal.fromComponent(carConfigModal, {
				title: '车辆配置',
				theme: 'assertive',
				onHide: () => {
					// console.log();
				}
			}).then((modal) => {
				this.carConfigModal = modal;
			});

			$modal.fromComponent(carFuelModal, {
				title: '燃料类型',
				theme: 'assertive',
				onHide: () => {
					// console.log();
				}
			}).then((modal) => {
				this.carFuelModal = modal;
			});

		},
		created() {

			bus.$on('carFuel', (text) => {
				this.res.carFuel = text;
				this.carFuelModal.hide();
			});
			bus.$on('carEnviron', (text) => {
				this.res.carEnviron = text;
				this.carEnvironModal.hide();
			});
			bus.$on('configList', (text) => {
				this.res.configList = text;
			});
			bus.$on('configNameList', (text) => {				
				this.res.configNameList = text;
				this.configNameList = text;
			});
			bus.$off('carImgList')
			bus.$on('carImgList', (text) => {
				this.$nextTick().then(res => {
					this.carImgList = JSON.stringify(text);
				})
				
			});
			window.axios.get(baseUrl + '/controller/getCarById', {
				params: {
					carId: this.$route.query.carId,
					imageViewId:2,
				}
			}).then((res) => {
				//				console.log(res.data.result)
				
				this.res = res.data.result		
				this.pushNotification = this.res.car4sUpkeepState?true:false
			})
			window.axios.get(baseUrl + '/controller/getCarConfById', {
				params: {
					carId: this.$route.query.carId
				}
			}).then((res) => {
				for(let i of res.data.result) {
					for(let j of i.childCarConf) {
						if(j.selectedState) {
							this.res.configNameList += ` ${j.confName}`
							this.res.configList += `${j.confId},`
						}
					}
				}
				this.res.configList = this.configList.slice(0, this.configList.length - 1)
			})

		},
		destroyed() {
			if(this.carImgModal)
				$modal.destroy(this.carImgModal)
			if(this.carEnvironModal)
				$modal.destroy(this.carEnvironModal)
			if(this.carConfigModal)
				$modal.destroy(this.carConfigModal)
			if(this.carFuelModal)
				$modal.destroy(this.carFuelModal)
		},
		methods: {
			showImage() {
				this.carImgModal.show();
			},
			showCarEnviron() {
				this.carEnvironModal.show();
			},
			showCarConfig() {
				this.carConfigModal.show();
			},
			showCarFuel() {
				this.carFuelModal.show();
			},
			paramsImgInit() {
				bus.$carImgChange = []
			},
			nextStep(event) {
				var newList = this.carImgList||''
				console.log(newList)
				if (newList.indexOf('left_anterior') == -1) {
					$toast.show('请上传首图', 2000)
					return false
				}
				$dialog.confirm({
					// 标题					
					title: '提示',
					content: '确认申请入库',
					// 取消按钮文本
					cancelText: '取消',
					// 确定按钮文本
					okText: '确认'
				}).then((res) => {
					if(!res) return
					let formData = new FormData(event.target)
					formData.append('brandId',this.res.brandId)
					formData.append('carDisplacement',this.res.carDisplacement)					
					formData.append('carGearbox',this.res.carGearbox)			
					formData.append('carMileage',this.res.carMileage)
					formData.append('carOutColor',this.res.carOutColor)
					formData.append('carRetailPrice',this.res.carRetailPrice)
					formData.append('carTitle',this.res.carTitle)
					formData.append('carVin',this.res.carVin)
					formData.append('seriesId',this.res.seriesId)
					formData.append('regionId',this.res.regionId)
					formData.append('shopId',this.res.shopId)
					formData.append('modelId',this.res.carTypeId)
					formData.append('saleUserId',this.res.saleUserId)
					formData.append('carLicenceState',this.res.carLicenceState)
					if(this.res.carLicenceState==1){
						let carLicenceDate = new Date(this.res.carLicenceDate)
						let carValidateDate = new Date(this.res.carValidateDate)
						let carForceInsuranceDate = new Date(this.res.carForceInsuranceDate)
						formData.append('carLicenceDate',`${carLicenceDate.getFullYear()}-${carLicenceDate.getMonth()+1}-${carLicenceDate.getDate()}`)
						formData.append('carValidateDate',`${carValidateDate.getFullYear()}-${carValidateDate.getMonth()+1}-${carValidateDate.getDate()}`)
						formData.append('carForceInsuranceDate',`${carValidateDate.getFullYear()}-${carValidateDate.getMonth()+1}-${carValidateDate.getDate()}`)
					}
					
					window.axios.post(baseUrl + '/controller/car/toStorage',formData).then((res) => {
						if(res) {
							setTimeout(() => {
								$toast.show('申请成功', 2000)
								this.paramsImgInit()
								setTimeout(() => {
									this.$router.go(-2)
								}, 1000)
							}, 400)
						}
					});
				})
			}
			
		},
		watch:{
			'pushNotification'(){
				if(this.pushNotification)
					this.res.car4sUpkeepState = 1
				else
					this.res.car4sUpkeepState = 0
			}
		}
	}
</script>
<style scoped>
	.ic_upload_img {
		width: 25px;
		vertical-align: middle;
	}
</style>